<div class="slideshow-banner">
  <div class="banner-image">
    <div class="swiper tenways-slideshow-banner">
      <div class="swiper-wrapper">
        {%- for block in section.blocks -%}
          <div class="swiper-slide">
            <div class="block-slideshow">
              <div class="pc_banner banner__media media">
                <img srcset="
                                                                            {%- if block.settings.image.width >= 323 -%}{{ block.settings.image | img_url: '323x' }} 323w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 360 -%}{{ block.settings.image | img_url: '360x' }} 360w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 710 -%}{{ block.settings.image | img_url: '710x' }} 710w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 1140 -%}{{ block.settings.image | img_url: '1140x' }} 1140w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 1200 -%}{{ block.settings.image | img_url: '1200x' }} 1200w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 1780 -%}{{ block.settings.image | img_url: '1780x' }} 1780w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 2000 -%}{{ block.settings.image | img_url: '2000x' }} 2000w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 3000 -%}{{ block.settings.image | img_url: '3000x' }} 3000w,{%- endif -%}
                                                                            {%- if block.settings.image.width >= 3840 -%}{{ block.settings.image | img_url: '3840x' }} 3840w,{%- endif -%}" sizes="{% if block.settings.image_2 != blank and block.settings.stack_images_on_mobile %}(min-width: 750px) 50vw, 100vw{% elsif section.settings.image_2 != blank %}50vw{% else %}100vw{% endif %}" data-src="{{ block.settings.image | img_url: '1500x' }}" loading="lazy" class="lazyload" alt="{{ block.settings.image.alt | escape }}" width="{{ block.settings.image.width }}" height="{{ block.settings.image.height }}">
              </div>
              <div class="image_mobile banner__media media">
                <img srcset="
                                                                            {%- if block.settings.image_mobile.width >= 323 -%}{{ block.settings.image_mobile | img_url: '323x' }} 323w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 360 -%}{{ block.settings.image_mobile | img_url: '360x' }} 360w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 710 -%}{{ block.settings.image_mobile | img_url: '710x' }} 710w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 1140 -%}{{ block.settings.image_mobile | img_url: '1140x' }} 1140w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 1200 -%}{{ block.settings.image_mobile | img_url: '1200x' }} 1200w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 1780 -%}{{ block.settings.image_mobile | img_url: '1780x' }} 1780w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 2000 -%}{{ block.settings.image_mobile | img_url: '2000x' }} 2000w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 3000 -%}{{ block.settings.image_mobile | img_url: '3000x' }} 3000w,{%- endif -%}
                                                                            {%- if block.settings.image_mobile.width >= 3840 -%}{{ block.settings.image_mobile | img_url: '3840x' }} 3840w,{%- endif -%}" sizes="{% if block.settings.image_2 != blank and block.settings.stack_images_on_mobile %}(min-width: 750px) 50vw, 100vw{% elsif section.settings.image_2 != blank %}50vw{% else %}100vw{% endif %}" data-src="{{ block.settings.image | img_url: '1500x' }}" loading="lazy" class="lazyload" alt="{{ block.settings.image_mobile.alt | escape }}" width="{{ block.settings.image_mobile.width }}" height="{{ block.settings.image_mobile.height }}">
              </div>
              <div class="text-slideshow">
                <div class="block_text">
                  <div class="">


                      {%- form 'localization', id: 'FooterCountryForm' -%}
                        {% if localization.country.currency.symbol contains '$' and localization.country.currency.symbol != blank %}
                          <div class="multicolumn-card__info">
                            {%- if block.settings.title_us != blank -%}
                              <div class="p">{{ block.settings.title_us }}</div>
                            {%- endif -%}
                            {%- if block.settings.text_us != blank -%}
                              <div class="rte">{{ block.settings.text_us }}</div>
                            {%- endif -%}
                            {%- if block.settings.time_us != blank -%}
                              <div class="p_time">{{ block.settings.time_us }}</div>
                            {%- endif -%}
                            {%- if block.settings.button_label_us != blank -%}
                              <a {% if block.settings.button_link_us != blank %}href="{{ block.settings.button_link_us }}" {% endif %} class="button{% if block.settings.button_style_secondary %} button--secondary{% else %} button--primary{% endif %}" {% if block.settings.button_link_us == blank %} aria-disabled="true"{% endif %} {{ block.shopify_attributes }}>
                                <span>{{ block.settings.button_label_us | escape }}</span>
                              </a>
                            {%- endif -%}
                          </div>
                        {% else %}
                          <div class="multicolumn-card__info">
                            {%- if block.settings.title != blank -%}
                              <div class="p">{{ block.settings.title }}</div>
                            {%- endif -%}
                            {%- if block.settings.text != blank -%}
                              <div class="rte">{{ block.settings.text }}</div>
                            {%- endif -%}
                             {%- if block.settings.time != blank -%}
                              <div class="p_time">{{ block.settings.time }}</div>
                             {%- else -%}
                              <div class="p_time"><br/></div>
                            {%- endif -%}
                            {%- if block.settings.button_label != blank -%}
                              <a {% if block.settings.button_link != blank %}href="{{ block.settings.button_link }}" {% endif %} class="button{% if block.settings.button_style_secondary %} button--secondary{% else %} button--primary{% endif %}" {% if block.settings.button_link == blank %} aria-disabled="true"{% endif %} {{ block.shopify_attributes }}>
                                <span>{{ block.settings.button_label | escape }}</span>
                              </a>
                            {%- endif -%}
                          </div>
                        {% endif %}
                      {%- endform -%}

                  </div>
                </div>
              </div>
            </div>
          </div>
        {%- endfor -%}
      </div>
    </div>
  </div>
</div>



<script>
  var swiper = new Swiper('.tenways-slideshow-banner', {
    speed: 1000,
    slidesPerView: 1,
    spaceBetween: 30,
    loop: true,
    effect: 'fade',
    fadeEffect: {
      crossFade: true
    },
    autoplay: {
      delay: 5000,
      disableOnInteraction: false
    }
  });
</script>

{% schema %}
  {
    "name": "slideshow banner",
    "class": "spaced-section spaced-section--full-width",
    "tag": "section",
    "blocks": [
      {
        "type": "image",
        "name": "image",
        "settings": [
          {
            "type": "image_picker",
            "id": "image",
            "label": "Image"
          },
          {
            "type": "image_picker",
            "id": "image_mobile",
            "label": "Image mobile"
          },
          {
            "type": "text",
            "id": "title",
            "label": "Title"
          },
          {
            "type": "text",
            "id": "title_us",
            "label": "Title us"
          }, {
            "type": "richtext",
            "id": "text",
            "label": "Text"
          }, {
            "type": "richtext",
            "id": "text_us",
            "label": "Text US"
          }, {
            "type": "text",
            "id": "time",
            "label": "Time"
          }, {
            "type": "text",
            "id": "time_us",
            "label": "Time US"
          }, {
            "type": "text",
            "id": "button_label",
            "label": "Button label"
          }, {
            "type": "text",
            "id": "button_label_us",
            "label": "Button label US"
          }, {
            "type": "url",
            "id": "button_link",
            "label": "Button link"
          }, {
            "type": "url",
            "id": "button_link_us",
            "label": "Button link US"
          }
        ]
      }
    ],
    "presets": [
      {
        "name": "slideshow banner",
        "blocks": [
          {
            "type": "image"
          }, {
            "type": "image"
          }, {
            "type": "image"
          }
        ]
      }
    ]
  }
{% endschema %}